<!DOCTYPE html>
<html lang="zh">
<head th:replace="/admin/fragments/common :: head('订单后台管理')">
    <title></title>
</head>
<style>
    label {
        display: none;
    }
    .hidden{
        display: none;
    }
</style>
<body class="layout-fixed sidebar-expand-lg bg-body-tertiary app-loaded sidebar-open"
      onload="getOrderDetail()">
<div class="app-wrapper">
<!--    <nav th:replace="/admin/fragments/navbar :: header"></nav>-->
<!--    <aside th:replace="/admin/fragments/menu :: menu(order)"></aside>-->
    <main class="app-main">
        <div th:replace="/admin/fragments/common :: appContentHeader('订单管理')"></div>
        <div class="app-content">
            <div class="container-fluid">
                <div class="card card-primary card-outline mb-4"> <!--begin::Header-->
                    <div class="card-header">
                        <div class="card-title" id="orderTitle"></div>
                    </div> <!--end::Header-->
                    <!--begin::Form-->
                    <div class="card-body">
                        <div class="mb-3">
                            <label for="order_foodid">菜品名称</label>
                            <input type="text" class="form-control" id="order_foodid" name="foodid" placeholder="菜品名称">
                        </div>
                        <div class="mb-3">
                            <input type="hidden" id="food_id" name="id">
                            <label for="order_price">价格</label>
                            <input type="text" class="form-control" id="order_price" name="price" placeholder="价格">
                        </div>
                        <div class="mb-3">
                            <label for="order_userid">用户序号</label>
                            <input type="text" class="form-control" id="order_userid" name="userid" placeholder="用户序号">
                        </div>
                        <div class="mb-3">
                            <label for="order_ordertime">订单时间</label>
                            <input type="text" class="form-control" id="order_ordertime" name="ordertime" placeholder="订单时间">
                        </div>
                        <div class="mb-3">
                            <a href="javascript:void(0)" onclick="history.back()" class="btn btn-warning">返回</a>
                            <input type="button" value="保存修改" class="btn btn-primary" onclick="updateOrder()">
                            <div class="alert alert-success hidden" role="alert" id="showSuccess" style="margin-top: 5px;width:200px">
                                更新成功
                            </div>
                        </div>
                    </div>
                    <!--end::Form-->
                </div>
            </div>
        </div>
    </main>

    <script>
        function getOrderDetail(){
            const searchParams = new URLSearchParams(window.location.search);
            const oid = searchParams.get('id');

            axios.get("/api/admin/orderDetail", {
                params: {
                    id: oid
                }
            }).then(res=>{
                const order = res.data;
                console.log(order)
                document.getElementById("orderTitle").innerText = order.name+" 详情"
                document.getElementById("order_foodid").value = order.foodid;
                document.getElementById("order_price").value = order.price;
                document.getElementById("order_userid").value = order.userid;
                document.getElementById("order_ordertime").value = order.ordertime;
            })
        }

        function updateOrder(){
            console.log('更新数据');
            $("#showSuccess").addClass("hidden");
            const foodid = document.getElementById("order_foodid").value;
            const price = document.getElementById("order_price").value;
            const userid = document.getElementById("order_userid").value;
            const ordertime = document.getElementById("order_ordertime").value;
            const dataToUpdate = {
                foodid: foodid,
                price: price,
                userid: userid,
                ordertime: ordertime,
            }
            axios.post("/api/admin/order/update", dataToUpdate)
                .then(res=>{
                    if(res.data === 'ok'){
                        // alert('更新成功')
                        $("#showSuccess").removeClass("hidden");
                    }
                })
        }
    </script>
</div>
</body>
</html>